<template>
  <div class='search'>
    <f-form ref='form' :action='api.deposit' :form-key='this.formItem.depositId' :file-ids='fileIds'>
<!--      <f-form-item label='单位名称' placeholder='请选择单位名称' name='customName' @click='openCustomModal'  :readOnly='true' :required='true' :value.sync='formItem.customName' :trigger-change='true'>
        <a-tooltip slot='addonBefore' placement='top' title='点击图标选择单位名称'>
          <a-icon type='user' style='cursor:pointer' @click='openCustomModal' />
        </a-tooltip>
      </f-form-item>-->
      <f-form-item label='部门' placeholder='请选择部门' name='deptName' :readOnly='true' @click='openDeptModal'  :required='true' :value.sync='formItem.deptName' :trigger-change='true'>
        <a-tooltip slot='addonBefore' placement='top' title='点击图标选择部门'>
          <a-icon type='team' style='cursor:pointer' @click='openDeptModal' />
        </a-tooltip>
      </f-form-item>
      <f-form-item label='业务员' placeholder='请选择业务员' name='saleManName' @click='openSaleManModal' :readOnly='true' :required='true' :value.sync='formItem.saleManName' :trigger-change='true' v-if='formItem.deptId'>
        <a-tooltip slot='addonBefore' placement='top' title='点击图标选择业务员'>
          <a-icon type='user' style='cursor:pointer' @click='openSaleManModal' />
        </a-tooltip>
      </f-form-item>
      <f-form-item label='收款金额' type='number' dataType='number' name='payAmount' required :value='formItem.payAmount' />
      <f-form-item label='收款日期' type='date' name='payDate' required :value='formItem.payDate' />
      <f-form-item label='收款账户' placeholder='请选择收款账户' name='bankName' @click='openBankModal' :readOnly='true' :required='true' :value.sync='formItem.bankName' :trigger-change='true'>
        <a-tooltip slot='addonBefore' placement='top' title='点击图标选择'>
          <a-icon type='money-collect' style='cursor:pointer' @click='openBankModal' />
        </a-tooltip>
      </f-form-item>
      <f-form-item label='付款账户' placeholder='请选择付款账户' name='payBankName' @click='openCustomBankModal' :readOnly='true' :value.sync='formItem.payBankName' :trigger-change='true'>
        <a-tooltip slot='addonBefore' placement='top' title='点击图标选择'>
          <a-icon type='money-collect' style='cursor:pointer' @click='openCustomBankModal' />
        </a-tooltip>
      </f-form-item>
      <f-form-item label='附件' type='upload' name='fileList' :value='formItem.fileList' :file-max='3' :busId='this.formItem.depositId' busType='BusDeposit' :realRemove='true' @uploadSuccess='uploadSuccess' />
      <f-form-item label='备注' type='textarea' name='remark' :value='formItem.remark' />
    </f-form>
    <select-sale-man-modal ref='saleManModal' @onSelectChange='onSelectSaleManChange' :select-type='2'></select-sale-man-modal>
    <select-dept-modal ref='deptModal' @onSelectChange='onSelectDeptChange'></select-dept-modal>
    <select-custom-modal ref='customModal' @onSelectChange='onSelectCustomChange'></select-custom-modal>
    <select-hy-remoter-custom-modal ref='customModal' @onSelectChange='onSelectCustomChange'></select-hy-remoter-custom-modal>
    <select-custom-bank-modal ref='customBankModal' @onSelectChange='onSelectCustomBankChange'></select-custom-bank-modal>
    <select-bank-modal ref='bankModal' @onSelectChange='onSelectBankChange'></select-bank-modal>
  </div>
</template>
<script>
import api from "../../js/api"
import SelectBankModal from "@/views/module/haiying/components/select_bank_modal"
import SelectHyRemoterCustomModal from "@/views/module/haiying/components/select_hy_remoter_custom_modal"
import { commonMixins } from "@/core/mixins/commonMixins"
import SelectCustomBankModal from "@/views/module/haiying/components/select_custom_bank_modal"
import SelectSaleManModal from "@/views/module/haiying/components/select_saleman_modal"
import SelectDeptModal from "@/views/module/haiying/components/select_dept_modal"

export default {
  name: "DepositForm",
  props: {},
  mixins: [commonMixins],
  data() {
    return {
      refs: this.$refs,
      api: Object.assign(api, this.api),
      isAdd: true,//是否是添加模式
      fileIds: [],//上传文件ID
      loaded: false,//是否加载完成
      loadSaleManParams: {
        deptId: null
      },
      autoLoad: false,
      formItem: this.getFormItem()
    }
  },
  methods: {
    getFormItem() {
      return {
        depositId: 0,
        checkState: 0,
        customName: "",
        customId: 0,
        payAmount: 0,
        payBankName: "",
        takeBankName: "",
        payBankNo: "",
        fileList: [],
        payDate: "",
        refundAmount: 0,
        refundDate: ""
      }
    },
    openCustomModal() {
      this.$refs["customModal"].open()
    },
    onSelectCustomChange(selectedRowKeys, selectedRows) {
      this.$refs.form.getForm().setFieldsValue({ "customName": selectedRows[0].customName })
      this.formItem.customName = selectedRows[0].customName
      this.formItem.customId = selectedRows[0].customId
      this.formItem.customCode = selectedRows[0].customCode
    },
    /**
     * 银行选择回调
     */
    onSelectBankChange(selectedRowKeys, selectedRows) {
      this.$refs.form.getForm().setFieldsValue({ "bankName": selectedRows[0].bankName })
      this.formItem.bankName = selectedRows[0].bankName
      this.formItem.bankId = selectedRowKeys[0]
      this.formItem.bankNo = selectedRows[0].bankNo
      this.$forceUpdate()
    },

    /**
     * 付款银行选择回调
     */
    onSelectCustomBankChange(selectedRowKeys, selectedRows) {
      this.formItem.payBankId = selectedRowKeys[0]
      this.formItem.payBankNo = selectedRows[0].bankNo
      this.formItem.payBankName = selectedRows[0].bankName
      this.formItem.payUserName = selectedRows[0].saleManName
      this.$forceUpdate()
    },

    /**
     * 业务员选择回调
     */
    onSelectSaleManChange(selectedRowKeys, selectedRows) {
      this.$refs.form.getForm().setFieldsValue({ "saleManName": selectedRows[0].saleManName })
      this.formItem.saleManName = selectedRows[0].saleManName
      this.formItem.saleManId = selectedRowKeys[0]
      this.$forceUpdate()
    },
    /**
     * 部门选择回调
     */
    onSelectDeptChange(selectedRowKeys, selectedRows) {
      this.$refs.form.getForm().setFieldsValue({ "deptName": selectedRows[0].deptName })
      this.formItem.deptName = selectedRows[0].deptName
      this.formItem.deptId = selectedRows[0].deptId
      this.$forceUpdate()
    },
    //表单赋值
    setData(data) {
      this.$refs.form.resetFields()
      this.formItem = this.getFormItem()
      if (data && data.depositId) {
        let params = {
          depositId: data.depositId
        }
        this.refs["form"].getDetails(params, (data) => {
          this.formItem = data
          this.loaded = true
        })
        this.isAdd = false
      } else {
        this.loaded = true
      }
    },
    /**
     * 文件上传回调
     */
    uploadSuccess(fileUrl, files, fileIds, removeIds) {
      this.fileIds = fileIds
      this.removeIds.push(...removeIds)
    },
    //提交表单
    handleSubmit(callback) {
      this.$refs.form.submit({
        saleManId: this.formItem.saleManId,
        customCode: this.formItem.customCode,
        removeIds: this.removeIds,
        deptId: this.formItem.deptId,
        payBankId: this.formItem.payBankId,
        payBankNo: this.formItem.payBankNo,
        bankId:this.formItem.bankId
      }, callback)
    }
  },
  created() {
  },
  components: { SelectDeptModal, SelectSaleManModal, SelectCustomBankModal, SelectHyRemoterCustomModal, SelectBankModal }
}
</script>

<style scoped lang='less' rel='stylesheet/less'>

</style>
